import React, { FC } from 'react'
import { Outlet, useLocation, useNavigate } from 'react-router-dom'
import './manageLayout.scss'
import { Button, Divider, Space } from 'antd'
import { BarsOutlined, StarOutlined } from '@ant-design/icons'

interface IHomeProps {}

const ManageLayout: FC<IHomeProps> = () => {
  const nav = useNavigate()
  const { pathname } = useLocation()
  // const [loading, setLoading] = useState(false)

  // async function handleCreateClick() {
  //   setLoading(true)
  //   const data = await createQuestionService()
  //   const { id } = data || {}
  //   if (id) {
  //     nav(`/question/edit/${id}`)
  //     message.success('创建成功')
  //   }
  //   setLoading(false)
  // }

  return (
    <div className="container">
      <div className="left">
        <Space direction="vertical">
          <Divider style={{ borderTop: 'transparent' }} />
          <Button
            type={pathname.startsWith('/main_window/list') ? 'default' : 'text'}
            size="large"
            icon={<BarsOutlined />}
            onClick={() => nav('/main_window/list')}
          >
            我的问卷
          </Button>

          <Button
            type={pathname.startsWith('/main_window/star') ? 'default' : 'text'}
            size="large"
            icon={<StarOutlined />}
            onClick={() => nav('/main_window/star')}
          >
            星标问卷
          </Button>
        </Space>
      </div>
      <div className="right">
        <Outlet />
      </div>
    </div>
  )
}

export default ManageLayout
